<template>
	<view class="container">
		<view class="info-container">
			<scroll-view scroll-y class="scroll-container" v-show="tabbarIndex==0" @scrolltolower="loadDeal">
				<view class="hall-container">
					<view class="items" v-if="deal_list.length>0">
						<view class="item" v-for="(item,index) in deal_list" :key="index">
							<image :src="item.head_pic" mode="widthFix" class="item-img"></image>
							<view class="right">
								<view class="right-left-item">
									<view class="right-left-item-top">
										<view class="piao">{{item.name}}</view>
										<text>数量:{{item.money}}</text>
									</view>
									<view class="mobile">{{item.mobile}}</view>
								</view>
								<view class="right-right-item">
									<view class="right-right-item-top">
										<text>售价:</text>
										<text>{{item.amount}}</text>
										<text>元</text>
									</view>
									<button size="mini" class="buy-btn" @click="toBuy(item,index)">抢购</button>
								</view>
							</view>
						</view>
					</view>
					<view class="empty-container" v-else>
						<u-empty text="暂无相关数据" :icon="emptyIcon"/>
					</view>
					<view style="height: 20rpx;"></view>
				</view>
			</scroll-view>
			<view class="sale-container" v-show="tabbarIndex==1">
				<my-tab :list="list1" bgColor="#fff" :current="currentIndex" @itemClick='itemClick'></my-tab>
				<scroll-view class="item-container" scroll-y @scrolltolower="loadSell">
					<view class="items-contaner">
						<view class="items" v-if="sell_list.length>0">
							<view class="row-item" v-for="(item,index) in sell_list" :key="index" @click="toDealDetail(item,index)">
								<view class="top">
									<view class="top-left">
										<view class="piao">{{item.name}}</view>
										<text>数量:{{item.money}}</text>
									</view>
									<view class="top-right cancel" v-if="item.status==3">已取消</view>
									<view class="top-right theme" v-else-if="item.status==1 || item.status==2">已完成</view>
									<view class="top-right" v-else>出售中</view>
								</view>
								<view class="bot">
									<view class="bot-left">
										<image src="https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/deal/shouyi.png" mode="widthFix" class="shouyi-img"></image>
										<text>收益:{{item.total_amount}}</text>
									</view>
									<button size="mini" class="do-btn" v-if="item.status==-1" @click.stop="cancel(item,index)">取消</button>
									<button size="mini" class="do-btn" v-else-if="item.status==1 || item.status==2">已完成</button>
									<button size="mini" class="do-btn" disabled v-else>已取消</button>
								</view>
							</view>
						</view>
						<view class="empty-container" v-else>
							<u-empty text="暂无相关数据" :icon="emptyIcon"/>
						</view>
					</view>
					<view style="height: 20rpx;"></view>
				</scroll-view>
			</view>
			<scroll-view class="mairu-container" scroll-y v-show="tabbarIndex==2" @scrolltolower="loadBuy">
				<view class="items-container">
					<view class="items" v-if="buy_list.length>0">
						<view class="row-item" v-for="(item,index) in buy_list" :key="index">
							<view class="top">
								<view class="top-left">
									<view class="piao">{{item.name}}</view>
									<text>数量:{{item.money}}</text>
								</view>
								<view class="jiage">
									<text>金额:</text>
									<text>{{item.amount}}</text>
									<text>元</text>
								</view>
							</view>
							<view class="bot">
								<view class="buy-time">购买时间：{{item.time_text}}</view>
							</view>
						</view>
					</view>
					<view class="empty-container" v-else>
						<u-empty text="暂无相关数据" :icon="emptyIcon"/>
					</view>
					<view style="height: 20rpx;"></view>
				</view>
			</scroll-view>
			<view class="duihuan-container" v-show="tabbarIndex==3">
				<my-tab :list="dhList" bgColor="#fff" :current="dhCurrentIndex" @itemClick='dhItemClick'></my-tab>
				<view class="line"></view>
				<view class="cate-container cate" v-if="dhIndex==0">
					<scroll-view scroll-y scroll-with-animation class="left-view"
						:scroll-into-view="itemId">
						<view v-for="(item,index) in piao_list" :key="index" class="left-view-item"
							:class="{'left-view-item-active':piao_id==item.id}" @tap.stop="cateClick(item)">
							<text class="u-line-1">{{item.name}}</text>
						</view>
					</scroll-view>
					<scroll-view scroll-y scroll-with-animation class="right-view" @scrolltolower="loadGoods">
						<block v-if="goods_list.length>0">
						<view class="goods-row-item" v-for="(item,index) in goods_list" :key="index"
							@tap='toGoodsDetail(item)'>
							<image :src="item.goods_img" mode="widthFix" class="goods-img"></image>
							<view class="right">
								<text class="goods-name">{{item.goods_name}}</text>
								<view class="right-bot">
									<view class="bot_bot_one">
										<text>￥</text>
										<text class="price">{{item.goods_price}}</text>
									</view>
									<text class="bot_bot_three">销量：{{item.sales_sum}}</text>
								</view>
							</view>
						</view>
						</block>
						<view class="empty-container" v-else>
							<u-empty text="暂无相关商品" icon="https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/common/empty.png"/>
						</view>
					</scroll-view>
				</view>
				<view class="order-container" v-if="dhIndex==1">
					<scroll-view scroll-y class="scroll" @scrolltolower="loadMoreOrder">
						<view class="order-items" v-if="order_list.length>0">
						<view class="order-item" v-for="(item,index) in order_list" :key="index" @click="toDhDetail(item,index)">
							<view class="top">
								<view class="left">{{item.time_text}}</view>
								<view class="right">{{item.status_text}}</view>
							</view>
							<view class="order-goods-rows">
								<view class="order-goods-row-item">
									<image :src="item.goods_img" mode="widthFix" class="goods-img"></image>
									<view class="right">
										<view class="goods-name">{{item.goods_name}}</view>
										<view class="right-bot">
											<view class="price">
												<text class="large">{{item.goods_price}}</text>
												<text>/{{item.pay_name}}</text>
											</view>
											<view class="num">x{{item.goods_num}}</view>
										</view>
									</view>
								</view>
							</view>
							<view class="total">
								<text class="black">实付:</text>
								<text class="large">{{item.order_amount}}</text>
								<text>/{{item.pay_name}}</text>
							</view>
							<view class="order-bot">
								<button size="mini">查看订单</button>
								<button size="mini" class="confirm" v-if="item.order_status==2" @click.stop="dh_order_confirm_show(item)">确认收货</button>
							</view>
						</view>
						</view>
						<view class="empty-container" v-else>
							<u-empty text="暂无相关订单" icon="https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/common/empty.png"/>
						</view>
					</scroll-view>
				</view>
			</view>
			<view style="height: 120rpx;" v-if="false"></view>
		</view>
		<view class="tabbar">
			<view class="tabbar-item" :class="{'act':tabbarIndex==0}" @click="changeTabbar(0)">
				<image :src="tabbarIndex==0?'https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/deal/tab-deal-sel.png':'https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/deal/tab-deal.png'" mode="widthFix" class="tabbar-item-img"></image>
				<text>交易大厅</text>
			</view>
			<view class="tabbar-item" :class="{'act':tabbarIndex==1}" @click="changeTabbar(1)">
				<image :src="tabbarIndex==1?'https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/deal/tab-sale-sel.png':'https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/deal/tab-sale.png'" mode="widthFix" class="tabbar-item-img"></image>
				<text>出售订单</text>
			</view>
			<view class="tabbar-item" :class="{'act':tabbarIndex==2}" @click="changeTabbar(2)">
				<image :src="tabbarIndex==2?'https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/deal/tab-mairu-sel.png':'https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/deal/tab-mairu.png'" mode="widthFix" class="tabbar-item-img"></image>
				<text>我的收益</text>
			</view>
			<view class="tabbar-item" :class="{'act':tabbarIndex==3}" @click="changeTabbar(3)">
				<image :src="tabbarIndex==3?'https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/deal/tab-duihuan-sel.png':'https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/deal/tab-duihuan.png'" mode="widthFix" class="tabbar-item-img"></image>
				<text>兑换商城</text>
			</view>
		</view>
		<u-popup :safeAreaInsetBottom="false" :safeAreaInsetTop="false" mode="center" :show="show" round="5"
			:overlay="true" :customStyle="customStyle1" @close="show=false">
			<view class="u-popup-slot">
				<text class="u-popup-slot_text">确认取消？</text>
				<view class="u-popup-slot_flex">
					<button @click="show = !show" class="cancel">取消</button>
					<button @click="confirm_cancel()" class="confirm">确认</button>
				</view>
			</view>
		</u-popup>
		<u-popup :safeAreaInsetBottom="false" :safeAreaInsetTop="false" mode="center" :show="sh_show" round="5"
			:overlay="true" :customStyle="customStyle1" @close="sh_show=false">
			<view class="u-popup-slot">
				<text class="u-popup-slot_text">确认收货？</text>
				<view class="u-popup-slot_flex">
					<button @click="sh_show = !sh_show" class="cancel">取消</button>
					<button @click="dh_order_confirm()" class="confirm">确认</button>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	var _this;
	export default {
		data() {
			return {
				customStyle1: {
					'width': '80%'
				},
				show: false,
				list1: [{
					name: '全部',
				}, {
					name: '出售中',
				}, {
					name: '已完成'
				}, {
					name: '已取消'
				}],
				currentIndex: 0,
				dhList: [{
					name: '兑换产品',
				}, {
					name: '兑换订单',
				}],
				emptyIcon:'https://farm-city.oss-cn-hangzhou.aliyuncs.com/static/common/empty.png',
				dhCurrentIndex: 0,
				dhIndex:0,
				tabbarIndex:0,
				itemId: '',
				hasMore:false,
				pageIndex:1,
				deal_list:[],
				deal_hasMore:true,
				deal_page:1,
				sell_item:{},
				sell_index:-1,
				yet_sell_load:false,
				sell_list:[],
				sell_hasMore:true,
				sell_page:1,
				yet_buy_load:false,
				buy_list:[],
				buy_hasMore:true,
				buy_page:1,
				yet_piao_load:false,
				piao_list:[],
				piao_id:0,
				goods_page:1,
				goods_hasMore:true,
				goods_list:[],
				yet_order_load:false,
				order_page:1,
				order_hasMore:true,
				order_list:[],
				sh_show:false,
				temp_order:{}
			};
		},
		methods: {
			dh_order_confirm_show(item){
				_this.temp_order=item
				_this.sh_show=true
			},
			async dh_order_confirm(){
				const params = {
					id:_this.temp_order.order_id,
				}
				//发送请求
				const data = await _this.$post('api/dh_dd_confirm',params)
				if(data.code==200){
					uni.$u.toast(data.msg)
					_this.temp_order['order_status']=3
					_this.temp_order['status_text']='已完成'
					_this.sh_show=false
				}else{
					uni.$u.toast(data.msg)
				}
			},
			cancel(item,index){
				_this.sell_item=item
				_this.sell_index=index
				_this.show=true
			},
			async confirm_cancel(){
				const params = {
					id: _this.sell_item.id
				}
				const data = await _this.$post('api/user_jy_qx',params)
				if(data.code==200){
					uni.$u.toast(data.msg)
					_this.sell_item.status=3
					_this.show=false
				}else{
					uni.$u.toast(data.msg)
				}
			},
			toDealDetail(item,index){
				uni.navigateTo({
					url:`/pages/deal/deal-detail?id=${item.id}&index=${index}`
				})
			},
			toBuy(item,index){
				uni.navigateTo({
					url:`/pages/deal/deal-buy?id=${item.id}&index=${index}`
				})
			},
			toGoodsDetail(item){
				uni.navigateTo({
					url:`/pages/goods/dh-goods-detail?id=${item.goods_id}`
				})
			},
			toDhDetail(item,index){
				uni.navigateTo({
					url:`/pages/order/dh-order-detail?id=${item.order_id}&index=${index}`
				})
			},
			loadSell(){
				if(_this.sell_hasMore){
					_this.sell_page++
					_this.get_order_list()
				}
			},
			loadBuy(){
				if(_this.buy_hasMore){
					_this.buy_page++
					_this.get_order_list()
				}
			},
			loadDeal(){
				if(_this.deal_hasMore){
					_this.deal_page++
					_this.get_jy_list()
				}
			},
			loadGoods(){
				if(_this.goods_hasMore){
					_this.goods_page++
					_this.get_dh_goods()
				}
			},
			loadMoreOrder(){
				if(_this.order_hasMore){
					_this.order_page++
					_this.get_dh_dd_list()
				}
			},
			itemClick(index){
				_this.currentIndex=index
				_this.sell_page=1
				_this.sell_list=[]
				_this.get_order_list()
			},
			dhItemClick(e){
				_this.dhIndex=e
				if(e==1 && !_this.yet_order_load){
					_this.get_dh_dd_list()
				}
			},
			changeTabbar(index){
				if(_this.tabbarIndex==index){
					return
				}
				//此处修改
				if(index==2){
					uni.navigateTo({
						url:'/pages/center/my-wallet'
					})
					return
				}
				_this.tabbarIndex=index
				if(index==1 && !_this.yet_sell_load){
					_this.get_order_list()
				}
				if(index==2 && !_this.yet_buy_load){
					_this.get_order_list()
				}
				if(index==3 && !_this.yet_piao_load){
					_this.get_piao_list()
				}
			},
			cateClick(item){
				if(_this.piao_id==item.id){
					return
				}
				_this.piao_id=item.id
				_this.goods_page=1
				_this.goods_list=[]
				_this.get_dh_goods()
			},
			async get_jy_list() {
				const params = {
					pageIndex: _this.deal_page,
					pageSize: 20,
				}
				const data = await _this.$post('api/get_jy_list',params)
				if (data.code == 200){
					_this.deal_list.push(...data.data.list)
					_this.deal_hasMore=data.data.list.length>=params.pageSize
				}else{
					_this.deal_hasMore=false
				}
			},
			async get_order_list() {
				const params = {
					pageIndex: _this.tabbarIndex==1?_this.sell_page:_this.buy_page,
					pageSize: 20,
					status: _this.currentIndex,
					type:_this.tabbarIndex==1?1:2
				}
				const data = await _this.$post('api/get_user_jy_list',params)
				if (data.code == 200){
					if(_this.tabbarIndex==1){
						_this.yet_sell_load=true
					}else if(_this.tabbarIndex==2){
						_this.yet_buy_load=true
					}
					if(_this.tabbarIndex==1){
						_this.sell_list.push(...data.data.list)
						_this.sell_hasMore=data.data.list.length>=params.pageSize
					}else{
						_this.buy_list.push(...data.data.list)
						_this.buy_hasMore=data.data.list.length>=params.pageSize
					}
				}else{
					if(_this.tabbarIndex==1){
						_this.sell_hasMore=false
					}else{
						_this.buy_hasMore=false
					}
				}
			},
			async get_piao_list() {
				const params = {
					is_all:1
				}
				const data = await _this.$post('api/get_piao_list',params)
				if (data.code == 200){
					_this.yet_piao_load=true
					_this.piao_list=data.data.list
					if(_this.piao_list.length>0){
						_this.piao_id=_this.piao_list[0]['id']
					}
					_this.get_dh_goods()
				}else{}
			},
			async get_dh_goods(){
				const params = {
					pageIndex: _this.goods_page,
					pageSize:20,
					wid:_this.piao_id,
				}
				const data = await _this.$post('api/get_dh_goods',params)
				if(data.code==200){
					this.goods_list.push(...data.data.list)
					this.goods_hasMore=data.data.list.length>=params.pageSize
				}else{
					this.goods_hasMore=false
				}
			},
			async get_dh_dd_list(){
				const params = {
					pageIndex: _this.order_page,
					pageSize:20,
				}
				const data = await _this.$post('api/get_dh_dd_list',params)
				if(data.code==200){
					_this.yet_order_load=true
					this.order_list.push(...data.data.list)
					this.order_hasMore=data.data.list.length>=params.pageSize
				}else{
					this.order_hasMore=false
				}
			}
		},
		onLoad(e) {
			_this = this;
			uni.$on('dealBuy',index=>{
				_this.deal_list.splice(index,1)
			})
			uni.$on('dealCancel',index=>{
				_this.sell_list[index]['status']=3
			})
			uni.$on('dhOrderConfirm',index=>{
				_this.order_list[index]['order_status']=3
				_this.order_list[index]['status_text']='已完成'
			})
			_this.get_jy_list()
		},
		onUnload() {
			uni.$off('dealBuy')
			uni.$off('dealCancel')
			uni.$off('dhOrderConfirm')
		},
		onShow() {},
		components: {}
	}
</script>

<style lang="scss" scoped>
	@import "@/static/css/deal.scss";
	@import "@/static/css/order.scss";
	@import "@/static/css/goods.scss";
	.container {
		position: relative;
		padding: 0;
		height: 100%;
	}
</style>
